﻿@using WHLRDF.Application.Model
@using WHLRDF.Application.BLL
@using WHLRDF.ORG.BLL
@using WHLRDF.WF.BLL
@inject IRelationUserService rService
@inject IOrganizationsService oService
@{

    ViewData["Title"] = "流程 管理";
   

    ViewBag.BodyCss = "fixed-sidebar no-skin-config full-height-layout  pace-done";

}
@section links{

}

<div class="fh-breadcrumb">

    <div class="fh-column" style="width:160px;">
        <div class="full-height-scroll">
            <div class="jstree flowtree">

            </div>
        </div>
    </div>

    <div class="full-height">
        <div class="full-height-scroll white-bg border-left ">
            <div class="tabs-container">
                <ul class="nav nav-tabs">
                    <li class="flow-map active">
                        <a data-toggle="tab" href="#tab-1">
                            流程图
                        </a>
                    </li>
                    <li style="display:none;" class="flow-param">
                        <a data-toggle="tab" href="#tab-2">
                            <i class="fa fa-gear"></i> 流程参数

                        </a>
                        <i class="fa fa-close" style="cursor:pointer;position: absolute; right: 8px; top: 13px;"></i>
                    </li>
                    <li style="display:none;" class="flow-rule">
                        <a data-toggle="tab" href="#tab-3">
                            <i class="fa fa-gear"></i>  节点属性

                        </a>
                        <i class="fa fa-close" style="cursor:pointer;position: absolute; right: 8px; top: 13px;"></i>
                    </li>
                </ul>
                <div class="tab-content">
                    <div id="tab-1" class="tab-pane active">
                        <div class="flow-container" style="overflow:auto;">
                            <div id="myflow_tools" class="ui-widget-content ui-draggable myflow_tools" style="cursor:pointer;position:absolute;z-index:10;top:50px;">
                                <div id="myflow_tools_handle" style="text-align: center;"
                                     class="ui-widget-header">工具集</div>

                                @*<div class="node" id="myflow_redraw"><img src="/lib/flow/myflow/img/save.gif" />&nbsp;&nbsp;重绘</div>
                                    <div class="node" id="myflow_save"><img src="/lib/flow/myflow/img/save.gif" />&nbsp;&nbsp;保存</div>*@


                                <div class="node selectable selected" id="pointer">
                                    <img src="/lib/myflow/img/Select.png" />&nbsp;&nbsp;选择
                                </div>

                                <div class="node selectable" id="path">
                                    <img src="/lib/myflow/img/Line.png" />&nbsp;&nbsp;流程线
                                </div>
                                <div class="node selectable" id="rejectpath">
                                    <img src="/lib/myflow/img/Fallback.png" />&nbsp;&nbsp;驳回线
                                </div>
                                <div class="node state" id="start" type="start">
                                    <img src="/lib/myflow/img/Start.png" />&nbsp;&nbsp;开始
                                </div>
                                <div class="node state" id="normal" type="normal">
                                    <img src="/lib/myflow/img/Normal.png" />&nbsp;&nbsp;普通
                                </div>
                                <div class="node state" id="queue" type="queue">
                                    <img src="/lib/myflow/img/queue.png" />&nbsp;&nbsp;队列
                                </div>
                                <div class="node state" id="subprocess" type="subprocess">
                                    <img src="/lib/myflow/img/Pass.png" />&nbsp;&nbsp;子流程
                                </div>
                                <div class="node state" id="judge" type="judge">
                                    <img src="/lib/myflow/img/Meet.png" />&nbsp;&nbsp;判断
                                </div>
                                <div class="node state" id="end" type="end">
                                    <img src="/lib/myflow/img/End.png" />&nbsp;&nbsp;结束
                                </div>

                            </div>
                            <div class="panel-group ui-widget-content ui-draggable col-lg-3" id="activtiy-dynamic-container" style="position:absolute;right:10px; padding:0;cursor:pointer;border:0;border-bottom:1px solid #e6e6e6;display:none; ">
                                <div class="panel panel-default">
                                    <div class="panel-heading ui-widget-header" id="activtiy-dynamic-container_handle" style="background:#1ab394;color:white;">
                                        <h5 class=" panel-title">
                                            <a data-toggle="collapse" data-parent="#activtiy-dynamic-container" href="#collapseOne" style="color:#fff;">属性</a>
                                            <i class="fa fa-close text-right activtiy-dynamic-container-close open" style="display:block;float:right;"></i>
                                        </h5>
                                    </div>
                                    <div id="collapseOne" class="panel-collapse collapse in">
                                        <div class="panel-body" style="padding:0px;border:0">
                                            <form id="activtiy-dynamic-form" method="post" action="/wf/flow/SaveActivity" class="form-horizontal" role="form">
                                                <div class="text-danger field-validation-valid"></div>

                                                <input type="hidden" name="IsNewAdd" id="IsNewAdd" value="true" />
                                                <input type="hidden" name="FlowId" id="FlowId" />
                                                <input type="hidden" name="RecipientId" id="RecipientId" />
                                                <div class="panel-group" id="accordion">
                                                    <div class="clearfix panel panel-default">
                                                        <div class="panel-heading" data-toggle="collapse" data-parent="#accordion" href="#collapseAttrOne" aria-expanded="true">
                                                            <h5 class="panel-title">
                                                                <a>基础属性</a>
                                                            </h5>
                                                        </div>
                                                        <div id="collapseAttrOne" class="panel-collapse  collapse in" aria-expanded="true">
                                                            <div class="panel-body">
                                                                <div class="form-group">
                                                                    <label for="ActivityName" class="col-md-3 control-label text-left">编码</label>
                                                                    <div class="col-md-9  text-left">

                                                                        <input name="ActivityId" id="ActivityId" class="form-control" disabled validate="{required:true  }" />

                                                                        <span class="text-danger field-validation-valid"></span>
                                                                    </div>

                                                                </div>
                                                                <div class="form-group">
                                                                    <label for="ActivityName" class="col-md-3 control-label text-left">名称</label>
                                                                    <div class="col-md-9  text-left">

                                                                        <input name="ActivityName" id="ActivityName" class="form-control" validate="{required:true  ,maxlength:50   }" />

                                                                        <span class="text-danger field-validation-valid"></span>
                                                                    </div>

                                                                </div>
                                                                <div class="form-group">
                                                                    <label for="ActivityType" class="col-md-3 control-label text-left">类型</label>
                                                                    <div class="col-md-9  text-left">

                                                                        <select name="ActivityType" id="ActivityType" tabindex="3" class="select2" disabled validate="{required:true}">

                                                                            @{
                                                                                var keyValuePairs = WHLRDF.ConvertHelper.ToEnumList(typeof(PhaseTypeEnum), false);
                                                                                if (keyValuePairs != null && keyValuePairs.Count > 0)
                                                                                {
                                                                                    foreach (var item in keyValuePairs)
                                                                                    {
                                                                                        <option value="@item.Key">@item.Value</option>
                                                                                    }
                                                                                }

                                                                            }
                                                                        </select>

                                                                        <span class="text-danger field-validation-valid"></span>
                                                                    </div>

                                                                </div>
                                                                <div class="form-group">
                                                                    <label for="OrderNum" class="col-md-3 control-label text-left">标识</label>
                                                                    <div class="col-md-9  text-left">

                                                                        <input name="OrderNum" id="AttrOrderNum" type="number" class="form-control" validate="{required:true   }" />

                                                                        <span class="text-danger field-validation-valid"></span>
                                                                    </div>

                                                                </div>
                                                                <div class="form-group">
                                                                    <label for="HttpUrl" class="col-md-3 control-label text-left">HttpUrl</label>
                                                                    <div class="col-md-9  text-left">

                                                                        <input name="HttpUrl" id="HttpUrl" class="form-control" />

                                                                        <span class="text-danger field-validation-valid"></span>
                                                                    </div>

                                                                </div>

                                                                <div class="form-group">
                                                                    <label for="Remark" class="col-md-3 control-label text-left">描述</label>
                                                                    <div class="col-md-9  text-left">

                                                                        <input name="Remark" id="txtRemark" class="form-control" />

                                                                        <span class="text-danger field-validation-valid"></span>
                                                                    </div>

                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="clearfix panel panel-default">
                                                        <div class="panel-heading collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseAttrThree" aria-expanded="false" c>
                                                            <h5 class="panel-title">
                                                                <a>接收对象</a>
                                                            </h5>
                                                        </div>
                                                        <div id="collapseAttrThree" class="panel-collapse  collapse" aria-expanded="false" style="height: 0px;">
                                                            <div class="panel-body">
                                                                <div class="form-group">
                                                                    <label for="RecipientType" class="col-md-3 control-label text-left"> 类别</label>
                                                                    <div class="col-md-9  text-left">
                                                                        <select name="RecipientType" id="RecipientType" tabindex="4" class="select2" validate="{required:true}">
                                                                            @{
                                                                                keyValuePairs = WHLRDF.ConvertHelper.ToEnumList(typeof(RecipientType), false);
                                                                                if (keyValuePairs != null && keyValuePairs.Count > 0)
                                                                                {
                                                                                    foreach (var item in keyValuePairs)
                                                                                    {
                                                                                        <option value="@item.Key">@item.Value</option>
                                                                                    }
                                                                                }

                                                                            }
                                                                        </select>

                                                                        <span class="text-danger field-validation-valid"></span>
                                                                    </div>
                                                                </div>

                                                                <div class="form-group">
                                                                    <label for="OrgId" class="col-md-3 control-label text-left">机构</label>
                                                                    <div class="col-md-9  text-left">
                                                                        <select name="OrgId" id="OrgId" tabindex="5" class="select2" validate="{required:true}">
                                                                            <option value="">请选择</option>
                                                                            @{
                                                                                var allOrg = oService.GetAll();
                                                                                if (allOrg != null && allOrg.Count > 0)
                                                                                {
                                                                                    foreach (var item in allOrg)
                                                                                    {
                                                                                        <option value="@item.OrgId">@item.OrgName</option>
                                                                                    }
                                                                                }

                                                                            }

                                                                        </select>


                                                                        <span class="text-danger field-validation-valid"></span>
                                                                    </div>

                                                                </div>


                                                                <div class="form-group">
                                                                    <label for="RecipientName" class="col-md-3 control-label text-left">接收对象</label>
                                                                    <div class="col-md-9  text-left">

                                                                        <input name="RecipientName" id="RecipientName" readonly="readonly" class="form-control" validate="{required:false   }" />

                                                                        <span class="text-danger field-validation-valid"></span>
                                                                    </div>
                                                                </div>


                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="clearfix panel panel-default">
                                                        <div class="panel-heading collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseAttrTwo" aria-expanded="false">
                                                            <h4 class="panel-title">
                                                                <a>事件</a>
                                                            </h4>
                                                        </div>
                                                        <div id="collapseAttrTwo" class="panel-collapse collapse" aria-expanded="false">
                                                            <div class="panel-body">
                                                                <div class="form-group">
                                                                    <label class="col-md-3 control-label text-right"></label>
                                                                    <div class="col-md-9 text-left">
                                                                        <div class="i-checks ">
                                                                            <label for="IsActive"> <input tabindex="15" name="IsActive" id="chkIsActive" type="checkbox">  激活发送消息 </label>
                                                                        </div>
                                                                    </div>

                                                                </div>
                                                                <div class="form-group">
                                                                    <label class="col-md-3 control-label text-right"></label>
                                                                    <div class="col-md-9 text-left">
                                                                        <div class="i-checks ">
                                                                            <label for="IsComplete"> <input tabindex="15" name="IsComplete" id="chkIsComplete" type="checkbox"> 成功后发送消息 </label>
                                                                        </div>
                                                                    </div>

                                                                </div>
                                                                <div class="form-group">
                                                                    <label class="col-md-3 control-label text-right"></label>
                                                                    <div class="col-md-9 text-left">
                                                                        <div class="i-checks ">
                                                                            <label for="IsReject"> <input tabindex="15" name="IsReject" id="chkIsReject" type="checkbox"> 驳回后发送消息 </label>
                                                                        </div>
                                                                    </div>

                                                                </div>
                                                                <div class="form-group">
                                                                    <label class="col-md-3 control-label text-right"></label>
                                                                    <div class="col-md-9 text-left">
                                                                        <div class="i-checks ">
                                                                            <label for="IsListener"> <input tabindex="15" name="IsListener" id="chkIsReject" type="checkbox"> 是否启用事件 </label>
                                                                        </div>
                                                                    </div>

                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>

                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div id="myflow" class="ui-droppable"></div>
                        </div>
                    </div>
                    <div id="tab-2" class="tab-pane">
                        <div class="fh-column" style="width:200px;">
                            <div class="jstree flowParamTree">
                            </div>
                        </div>

                        <div class="full-height">
                            <div class="full-height-scroll white-bg  ">
                                <div class="tab-content">
                                    <div id="tab-12" class="tab-pane active">
                                        <div class="ibox-content text-center p-md ibox-content-search">
                                            <form id="flow-params-dynamic-form" action="/wf/flow/SaveParams" method="post" class="form-horizontal">
                                                <div class="text-danger field-validation-valid"></div>
                                                <input type="hidden" name="FlowParamId" />
                                                <input type="hidden" name="id" />
                                                <input type="hidden" name="FlowId" />
                                                <input type="hidden" name="ParamType" />
                                                <input type="hidden" name="ResourceId" />
                                                <div class="form-group">
                                                    <label for="FlowParamName" class="col-md-2 control-label text-right"> 参数名称</label>
                                                    <div class="col-md-10  text-left">
                                                        <div class="input-group m-b">
                                                            <span class="input-group-addon">*</span>
                                                            <input name="FlowParamName" id="FlowParamName" class="form-control" validate="{required:true  ,maxlength:50,stringEn:true   }" />
                                                        </div>
                                                        <span class="text-danger field-validation-valid"></span>
                                                    </div>
                                                </div>
                                                <div class="form-group">
                                                    <label for="ParamValueType" class="col-md-2 control-label text-right"> 值类别</label>
                                                    <div class="col-md-10  text-left">
                                                        <div class="input-group m-b text-left">
                                                            <span class="input-group-addon"></span>
                                                            <select name="ParamValueType" id="ParamValueType" tabindex="5" class="select2" validate="{required:true}">
                                                                <option value="0">string</option>
                                                                <option value="1">number</option>
                                                            </select>
                                                        </div>
                                                        <span class="text-danger field-validation-valid"></span>
                                                    </div>

                                                </div>
                                                <div class="form-group">
                                                    <label for="DefaultValue" class="col-md-2 control-label text-right"> 默认值</label>
                                                    <div class="col-md-10  text-left">
                                                        <div class="input-group m-b">
                                                            <span class="input-group-addon"></span>
                                                            <input name="DefaultValue" id="DefaultValue" class="form-control" validate="{required:false  ,maxlength:50   }" />
                                                        </div>
                                                        <span class="text-danger field-validation-valid"></span>
                                                    </div>

                                                </div>
                                                <div class="form-group">
                                                    <label for="OrderNum" class="col-md-2 control-label text-right"> 排序</label>
                                                    <div class="col-md-10  text-left">
                                                        <div class="input-group m-b">
                                                            <span class="input-group-addon">*</span>
                                                            <input name="OrderNum" id="pOrderNum" type="number" class="form-control" validate="{required:true,number:true     }" />
                                                        </div>
                                                        <span class="text-danger field-validation-valid"></span>
                                                    </div>

                                                </div>
                                                <div class="form-group">
                                                    <label for="Remark" class="col-md-2 control-label text-right">描述</label>
                                                    <div class="col-md-10  text-left">
                                                        <div class="input-group m-b">
                                                            <span class="input-group-addon"></span>
                                                            <input name="Remark" id="pRemark" class="form-control" validate="{required:false  ,maxlength:200   }" />
                                                        </div>

                                                    </div>

                                                </div>

                                                <div class="form-group">
                                                    <div class="col-sm-4 col-sm-offset-2">
                                                        <button class="btn btn-primary" type="submit">保 存</button>
                                                        <button class="btn btn-default" type="reset">新 增</button>
                                                    </div>
                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div id="tab-3" class="tab-pane">
                        <div class="fh-column" style="width:200px;">
                            <div class="panel-group" id="accordion">
                                <div class="panel panel-default">
                                    <div class="panel-heading">
                                        <h5 class="panel-title">
                                            <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne4">成功规则</a>
                                        </h5>
                                    </div>
                                    <div id="collapseOne4" class="panel-collapse collapse in">
                                        <div class="panel-body">
                                            <div class="jstree flowRuleTree-success">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="panel panel-default">
                                    <div class="panel-heading">
                                        <h4 class="panel-title">
                                            <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">驳回规则</a>
                                        </h4>
                                    </div>
                                    <div id="collapseTwo" class="panel-collapse collapse">
                                        <div class="panel-body">
                                            <div class="jstree flowRuleTree-reject">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="panel panel-default">
                                    <div class="panel-heading">
                                        <h4 class="panel-title">
                                            <a data-toggle="collapse" data-parent="#accordion" href="#collapseThree">激活规则</a>
                                        </h4>
                                    </div>
                                    <div id="collapseThree" class="panel-collapse collapse">
                                        <div class="panel-body">
                                            <div class="jstree flowRuleTree-Activity">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>
                        <div class="full-height">
                            <div class="full-height-scroll white-bg  ">
                                <div class="tab-content">
                                    <div class="ibox-content text-center p-md ibox-content-search">
                                        <form id="flow-rules-dynamic-form" action="/wf/flow/SaveRules" method="post" class="form-horizontal">
                                            <div class="text-danger field-validation-valid"></div>
                                            <input type="hidden" name="FlowRuleId" />
                                            <input type="hidden" name="FlowId" />
                                            <input type="hidden" name="FlowRuleType" value="0" />
                                            <input type="hidden" name="ActivityId" />

                                            <div class="form-group">
                                                <label for="FlowRuleName" class="col-md-2 control-label text-right"> 规则名称</label>
                                                <div class="col-md-10  text-left">
                                                    <div class="input-group m-b">
                                                        <span class="input-group-addon">*</span>
                                                        <input name="FlowRuleName" id="FlowRuleName" class="form-control" validate="{required:true  ,maxlength:50   }" />
                                                    </div>
                                                    <span class="text-danger field-validation-valid"></span>
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label for="FlowRuleName" class="col-md-2 control-label text-right"> 规则</label>
                                                <div class="col-md-10  text-left">
                                                    <div class="query-filter">

                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label for="ToActivity" class="col-md-2 control-label text-right"> 目标节点</label>
                                                <div class="col-md-10  text-left">
                                                    <div class="input-group m-b text-left">
                                                        <span class="input-group-addon"></span>
                                                        <select name="ToActivity" id="ToActivity" tabindex="5" class="select2" validate="{required:true}"></select>
                                                    </div>
                                                    <span class="text-danger field-validation-valid"></span>
                                                </div>

                                            </div>

                                            <div class="form-group">
                                                <label for="Remark" class="col-md-2 control-label text-right">描述</label>
                                                <div class="col-md-10  text-left">
                                                    <textarea tabindex="5" class="form-control" ltype="textarea" rows="5" style="width:100%;" id="eRemark" name="Remark"></textarea>
                                                </div>

                                            </div>
                                            <div class="form-group">
                                                <div class="col-sm-4 col-sm-offset-2">
                                                    <button class="btn btn-primary" type="submit">保 存</button>
                                                    <button class="btn btn-default" type="reset"> 清 空</button>
                                                </div>
                                            </div>

                                        </form>
                                    </div>
                                    @*<button id="btnSearchBtn" class="btn btn-primary" type="button" >获取数据</button>
                                        <textarea id="txtSearchBtn" style="width:100%;" rows="5"></textarea>*@
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
</div>
<div class="modal inmodal fade in" id="flow-text-remark-modal" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title">备注</h4>
            </div>
            <div class="modal-body">
                <div class="form-group">

                    <div class="col-md-12  text-left">

                        <input name="flow-text-remark" id="flow-text-remark" class="form-control" validate="{required:true  ,maxlength:50,stringEn:true   }" />
                        <span class="text-danger field-validation-valid"></span>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary">确定</button>
            </div>
        </div>
    </div>
</div>
<div class="modal inmodal fade in" id="flow-Tree-JobFunction-modal" role="dialog">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title"></h4>
            </div>
            <div class="modal-body">
                <div class="jstree flow-Tree-JobFunction">

                </div>
            </div>

        </div>
    </div>
</div>
<div class="modal inmodal fade in" id="flow-Tree-Department-modal" role="dialog">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title"></h4>
            </div>
            <div class="modal-body">
                <div class="jstree flow-Tree-Department">

                </div>
            </div>

        </div>
    </div>
</div>

<div class="modal inmodal fade in" id="flow-Tree-Params-modal" role="dialog">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title"></h4>
            </div>
            <div class="modal-body">
                <div class="jstree flow-Tree-Params">

                </div>
            </div>

        </div>
    </div>
</div>
<div class="modal inmodal fade in" id="flow-Tree-step-modal" role="dialog">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title"></h4>
            </div>
            <div class="modal-body">
                <div class="jstree flow-Tree-step">

                </div>
            </div>

        </div>
    </div>
</div>
<div class="modal inmodal fade in" id="flow-flowProcess-modal" role="dialog">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title"></h4>
            </div>
            <div class="modal-body">
                <div class="jstree flow-flowProcess-step">

                </div>
            </div>

        </div>
    </div>
</div>
@section scripts{

   
    <script type="text/javascript">
        BaseUrl = "@Url.Content("~/WF")";

        $(document).ready(function () {
            myWorkflow.TreeId = ".flowtree";
            myWorkflow.workFlowId = "#myflow";
            myWorkflow.workFlowContainerId = ".flow-container";
            myWorkflow.InitTree();
            myWorkflow.InitFlow();

        });



    </script>
}
